<template>
	<div class="app">
		<h4>{{address}}，{{school}}，{{subject}}</h4>
		<h4>{{miniAddress}}，{{upSchool}}，{{subject}}</h4>
		{{real}}
		<!-- <h4>教我学习React的人是：李老师，他今年{{person.age.real}}岁了</h4> -->
		<Count/>
	</div>
</template>

<script>
	import Count from './components/Count.vue'
	import {mapState,mapGetters} from 'vuex'

	export default {
		name:'App',
		components:{Count},
		computed:{
			//下面这行是读取state中的“深层次”的数据（了解）
			...mapState({real:state => state.person.age.real}),

			...mapState(['address','school','subject']), //数组写法
			...mapGetters(['miniAddress','upSchool',])
		}
	}
</script>

<style>
	.app{
		background-color: gray;
		padding: 20px;
	}
</style>